<template>
  <article class="page">
    <headerbar>支部荣誉</headerbar>
    <section class="frame-content-sub no-bg">
      <section class="inner-content pdv-9 pdh-4">
        <div class="input-row-wrap">
          <div class="name">荣誉名称：</div>
          <input v-model="form.honorName" type="text" placeholder="请荣誉名称" />
        </div>
        <div class="input-row-wrap">
          <div class="name">荣誉级别：</div>
          <select
            name="select"
            class="select"
            v-model="form.level"
          >
            <option value="">请选择</option>
            <option value="1">国家级</option>
            <option value="2">省(部)级</option>
            <option value="3">厅(局)级</option>
            <option value="4">地(市)级</option>
            <option value="5">市(县)以下</option>
          </select>
        </div>
        <div class="input-row-wrap">
          <div class="name">荣誉图片：</div>
          <section class="upload-wrap">
            <cube-upload
              ref="uploadPoster"
              action=""
              accept="image/*"
              :simultaneous-uploads="1"
              @files-added="addPoster"
              @file-removed="removePoster"
              :max="1"
            />
          </section>
        </div>

        <div class="input-row-wrap">
          <div class="name">先进事迹：</div>
          <textarea v-model="form.xjsj" placeholder="请简要描述该相册所展示的支部活动内容" name="" id="" cols="30" rows="10"></textarea>
        </div>
        <div class="pdv-6"></div>
        <div @click="save($event)" v-preventReClick="1000" class="default-block-btn">提交</div>
        <div class="pdv-5"></div>
      </section>
    </section>
  </article>
</template>

<script>
  export default {
    name: 'honorAdd',
    data () {
      return {
        form: {
          "dgwId": "",
          "dgwName": "",
          "groupId": "",
          "groupName": "",
          "honorName": "",
          "honorPic": "",
          "honorPicUrl": "",
          "level": "",
          "type": 1,
          "xjsj": ""
        },
        videoCoverWellBeUpload:'',
        userInfo:'',
      }
    },
    created (){
      this.userInfo = this.$localStorage.get("userInfo");
      console.log('this.userInfo',this.userInfo);
      this.form = {
        "dgwId": this.userInfo.dgwGroupId,
        "dgwName": this.userInfo.dgwGroupName,
        "groupId": this.userInfo.mainGroupId,
        "groupName": this.userInfo.mainGroupName,
        "honorName": "",
        "honorPic": "",
        "honorPicUrl": "",
        "level": "",
        "type": 1,
        "xjsj": ""
      }
    },
    methods: {
      addPoster(file) {
        console.log(this.$refs.uploadPoster);
        console.log("addPoster", file[0]);
        this.videoCoverWellBeUpload = file[0];
      },
      removePoster(file) {
        this.videoCoverWellBeUpload = "";
      },
      save (e) {
        if (e.target.disabled) {
          return false
        }
        if (this.form.honorName === '') {
          return this.tools.tip('请填写荣誉名称')
        }
        if (this.form.level === '') {
          return this.tools.tip('请选择荣誉级别')
        }
        if (this.form.xjsj === '') {
          return this.tools.tip('请选择先进事迹')
        }
        if (this.videoCoverWellBeUpload.length < 1 && this.$refs.uploadPoster.files.length < 1) {
          return this.tools.tip('请选择图片')
        }
        this.tools.showLoading('上传中...')
        this.uploadPoster([this.videoCoverWellBeUpload]).then(res => {
          this.form.honorPic=res.fileId
          this.form.honorPicUrl=res.desc
          this.fetchService.honor_addOrUpdate(this.form).then(res => {
            this.tools.hideLoading()
            if (res.code !== 0) {
              return this.tools.tip(res.message)
            }
            this.tools.tip('上传成功')
            this.tools.back()
          })
        })
      },
      uploadPoster(file) {
        let formData = new FormData();
        formData.append("file", file[0]);
        return this.fetchService.o_upload(formData).then((res) => {
          if (res.code !== 0) {
            return tools.tip(res.message);
          }
          let ret = res.data;
          return ret;
        });
      },
    }
  }
</script>
<style scoped>
 .select{
   height: 1rem;
   line-height: 0.66667rem !important;
   padding-top: 0;
   padding-bottom: 0;
   margin-bottom: 0;
   background: #ffffff;
   border: 1px solid #d4c9c9 !important;
   border-radius: 0.13333rem;
   font-size: 16PX;
  }
 .input-row-wrap input, .input-row-wrap textarea {
   font-size: 14PX;
   font-family: dang;
   padding: 0.21333rem 0.28rem;
   height: auto;
   background: #fff;
   /* border: 1px solid rgba(89,89,89,0.1); */
   border-radius: 0.13333rem;
   color: #999;
   line-height: 1.5em;
   border: 1px solid #d4c9c9 !important;
 }
</style>
